<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body>
		<div id="box">
			<span>hello world</span>
			
		</div>
		<button id="btn">按钮</button>
		<script type="text/javascript">
			
			var btn1 = document.getElementById("btn")
			//匿名函数
			btn1.onclick = function fn () {
				var div1 = document.getElementById("box") 
				//innerHTML在JS是双向功能：获取对象的内容 或 向对象插入内容；
				
				
				div1.innerHTML = '<span style="color: red">百度一下：www.baidu.com</span>'
//				div1.innerText = '<span style="color: red">百度一下：www.baidu.com</span>'

                //innerText获取设置纯文本
//              alert(div1.innerText)
                //带html标签
//              alert(div1.innerHTML)
			}
		</script>
	</body>
</html>